<!DOCTYPE html>
<html lang="zh-cmn-Hans">
<head>
    <meta charset="UTF-8" />
    <meta content="IE=edge" http-equiv="X-UA-Compatible" />
    <meta content="webkit" name="renderer" />
    <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport" />



    <title>程序加载中...</title>
</head>


<style>

    .first-loading-wrp{display:flex;flex-direction:column;align-items:center;justify-content:center;height:90vh;min-height:90vh}
    .first-loading-wrp>h1{font-size:28px;font-weight:bolder}
    .first-loading-wrp .loading-wrp{display:flex;align-items:center;justify-content:center;padding:98px}
    .dot{position:relative;box-sizing:border-box;display:inline-block;width:64px;height:64px;font-size:64px;transform:rotate(45deg);animation:antRotate 1.2s infinite linear}
    .dot i{position:absolute;display:block;width:28px;height:28px;background-color:#00f;border-radius:100%;opacity:.3;transform:scale(.75);transform-origin:50% 50%;animation:antSpinMove 1s infinite linear alternate}
    .dot i:nth-child(1){top:0;left:0}
    .dot i:nth-child(2){top:0;right:0;-webkit-animation-delay:.4s;animation-delay:.4s}
    .dot i:nth-child(3){right:0;bottom:0;-webkit-animation-delay:.8s;animation-delay:.8s}
    .dot i:nth-child(4){bottom:0;left:0;-webkit-animation-delay:1.2s;animation-delay:1.2s}
    @keyframes antRotate{to{-webkit-transform:rotate(405deg);transform:rotate(405deg)} }
    @-webkit-keyframes antRotate{to{-webkit-transform:rotate(405deg);transform:rotate(405deg)} }
    @keyframes antSpinMove{to{opacity:1} }
    @-webkit-keyframes antSpinMove{to{opacity:1} }

</style>


<body arco-theme="light">
<noscript></noscript>
<div id="app">
    <div class="first-loading-wrp">
        <div class="loading-wrp">
            <span class="dot dot-spin"><i></i><i></i><i></i><i></i></span>
        </div>
        <small style="color: #999999">初次加载资源可能需要较多时间，请耐心等待</small>
    </div>

</div>

<script type="module" src="./src/main.ts"></script>
<script src="https://map.qq.com/api/gljs?v=1.exp&libraries=service&key=ONQBZ-2WV3B-BLSUG-NADFC-5S3HJ-CGFBB"></script>
<link rel="stylesheet" href="https://g.alicdn.com/de/prismplayer/2.15.2/skins/default/aliplayer-min.css" />
<script charset="utf-8" type="text/javascript" src="https://g.alicdn.com/de/prismplayer/2.15.2/aliplayer-min.js"></script>

</body>
</html>
